<template>
	<div>
		<AplidForm v-model="searchModel" v-bind="searchErrorConfig" ref="searchRef" :showRules="false" @reset="onReset" @submit="onSearch">
			<template v-slot:timeForm="{ model }">
				<el-cascader v-model="model.time" :options="timeOptions" clearable :props="{ checkStrictly: true }" />
			</template>
		</AplidForm>
		<ApldTable ref="tableRef" v-bind="tableConfig" :data="tableData">
			<template v-slot:menu="{ row }">
				<el-button type="primary" text @click="handleOperate(row)">查看详情</el-button>
			</template>
		</ApldTable>

		<el-drawer v-model="drawer" :with-header="false" append-to-body size="65%">
			<ErrorOrder
				v-if="drawer"
				:errorType="nowData.error_type"
				:params="searchModel"
				:orgAreaId="orgAreaId"
				:compareRuleId="compareRuleId"
			></ErrorOrder>
		</el-drawer>
	</div>
</template>

<script setup lang="ts">
import apiMod from '@/apiMod/index'
import { searchErrorConfig, timeOptions } from './config'
import { ApldTable } from '@/components/AplidCrud'
import ErrorOrder from './ErrorOrder.vue'

const props = defineProps<{
	compareRuleId?: any
	orgAreaId?: string | number
	params?: any
}>()

const drawer = ref(false)
const nowData = ref({
	error_type: '',
})
const searchModel = ref({
	...(props.params || {}),
})
const tableData = ref([])
const tableConfig = ref({
	stripe: true,
	border: true,
	columns: [
		{ label: '类型', prop: 'error_info' },
		{ label: '数量', prop: 'count' },
		{ label: '人数', prop: 'times' },
		{
			label: '操作',
			prop: 'menu',
			width: 300,
			fixed: 'right',
		},
	],
})

const handleOperate = (row) => {
	nowData.value = row
	drawer.value = true
}
const onReset = () => {
	getInitData()
}

const onSearch = (form, done) => {
	const padStart = (val: any) => val && val.toString().padStart(2, 0)
	if (form.time) {
		form.belongHalf = `${form.belongYear}-${padStart(form.time[0])}`
		form.belongQuarter = `${form.belongYear}-${padStart(form.time[1])}`
		form.belongMonth = `${form.belongYear}-${padStart(form.time[2])}`
	}
	getInitData()
	done()
}

const getInitData = () => {
	apiMod
		.view_omCompareData_statisticsSimple({
			...searchModel.value,
			compareRuleId: props.compareRuleId,
			orgAreaId: props.orgAreaId,
			groupByFields: 'error',
			hasUserLogin: false,
			time: undefined,
		})
		.then((res) => {
			tableData.value = res.data
		})
}

onMounted(() => {
	getInitData()
})
</script>

<style scoped></style>
